<template>
  <div>
    <van-uploader :after-read="afterRead">
      <van-button icon="plus" type="primary">上传文件</van-button>
    </van-uploader>
    <div style="width: 500px; height: 500px" id="dicomImage"></div>
  </div>
</template>

<script>
import { getExampleImage } from "@/utils/loaderImg";
import * as cornerstone from "cornerstone-core";
import * as dicomParser from "dicom-parser";

export default {
  data() {
    return {
      fileList: [],
    };
  },
  mounted() {
    cornerstoneWADOImageLoader.external.cornerstone = cornerstone;
    console.log("cornerstoneWADOImageLoader", cornerstoneWADOImageLoader);
  },

  methods: {
    afterRead(file) {
      console.log(file);
      let reader = new FileReader();
      reader.readAsArrayBuffer(file.file);
      reader.onload = function (event) {
        let arrayBuffer = reader.result;
        var byteArray = new Uint8Array(arrayBuffer);
        var dataSet = dicomParser.parseDicom(byteArray);
        // access a string element
        // var studyInstanceUid = dataSet.string("x0020000d");
        // get the pixel data element (contains the offset and length of the data)
        var pixelDataElement = dataSet.elements.x7fe00010;
        // create a typed array on the pixel data (this example assumes 16 bit unsigned data)
        var pixelData = new Uint16Array(
          dataSet.byteArray.buffer,
          pixelDataElement.dataOffset,
          pixelDataElement.length / 2
        );

        cornerstone.registerImageLoader("example", getExampleImage);
        const imageId = "example://";
        const element = document.getElementById("dicomImage");
        cornerstone.enable(element);
        cornerstone.loadImage(imageId, pixelData).then(function (image) {
          cornerstone.displayImage(element, image);
          cornerstone.fitToWindow(element);
        });
      };
    },
  
  },
};
</script>

<style>
</style>